<template>
  <div class="auto">
    <partial-view v-ref:pv>
      <div class="row">
        <label class = " col-sm-3 control-label">用户姓名:</label>
        <span style="padding:0" class = " col-sm-3">{{model[0].f_user_name}}</span>
        <!-- <label class = "col-sm-3 control-label">操作人:</label>
        <span class = "col-sm-3">{{model.f_operator}}</span> -->
      </div>
      <table class="table table-bordered table-condensed self-table" id="table" >
        <thead>
          <tr>
             <th>更改列名</th>
             <th>更改前</th>
             <th>更改后</th>
          </tr>
        </thead>
        <tbody v-for="row in model">
          <tr>
            <td>{{getValue(row.f_field_name)}}</td>
            <td>{{row.f_used_content}}</td>
            <td>{{row.f_new_content}}</td>
          </tr>
        </tbody>
      </table>
      <!-- <div class="row text-center" style = "margin-top:5px">
        <label style="padding:0" class = " col-sm-3 control-label">更改列名</label>
        <label style="padding:0" class = " col-sm-4 control-label">更改前</label>
        <label style="padding:0" class = " col-sm-4 control-label">更改后</label>
      </div>
      <div class="row" v-for = "row in model" style = "word-break:break-all;">
        <span style="padding:0" class = " col-sm-4 ">{{row.f_field_name}}</span>
        <span style="padding:0" class = " col-sm-4 ">{{row.f_used_content}}</span>
        <span style="padding:0" class = " col-sm-4">{{row.f_new_content}}</span>
      </div> -->
    </partial-view>
  </div>
</template>

<script>
import Table from '../../../../Table'
export default {
  title: '档案变更详情',
  props: ['data'],
  data () {
    return {
      model: {}
    }
  },
  ready () {
    let sql = 'userChange'
    let condition = this.data.id

    this.$info(`加载数据中..., sql:${sql}`)
    this.$refs.pv.load('rs/sql/userChange', {data: {condition: condition}}).then((a) => {
      this.$info(`成功获取到数据！, data:${JSON.stringify(a.data)}`)
      this.model = a.data
    }).catch((error) => {
      if (error.status) {
        this.$warn(`加载数据出错, ${JSON.stringify(error)}`)
        return
      }
      throw error
    })
  },
  methods: {
    // 获取表中字段对应的中文名
    getValue (key) {
      return Table.data[key]
    }
  }
}
</script>
